<div class="modal-header">
    <button class="close" data-dismiss="modal">x</button>
    <h4 class="modal-title">查看成员</h4>
</div>
<div class="modal-body">
    <div class="row">
        <div class="col-md-4 mb20">
            <img src="${member.user.avatarUrl}" class="avatar-lg img-responsive center-block">
        </div>
        <div class="col-md-8 text-center-xs">
            <p>${member.user.html}</p>

            <p>${member.joinTime,prettyTime}加入</p>
            <!--@if(admin||galleryCreater){-->
            <p>
                <!--@if(member.active){-->
                <button class="btn btn-default" id="btn-member-disable">
                    <span class="glyphicon glyphicon-remove"></span>&nbsp;封禁此人
                </button>
                <!--@}else{-->
                <button class="btn btn-default" id="btn-member-enable">
                    <span class="glyphicon glyphicon-ok"></span>&nbsp;解封此人
                </button>
                <!--@}-->
            </p>
            <!--@}-->
        </div>
    </div>
</div>
<script>
    $("#btn-member-disable").click(function () {
        var $this = $(this);
        if ($this.data("time")) {
            clearTimeout($this.data("time"));
            $this.removeData("time");
        }
        if ($this.data("executable")) {
            $.getJSON("/gallery/member/disable/${member.id}", function (json) {
                if (json.ok) {
                    location.reload();
                } else {
                    alert(json.msg);
                }
                $(".modal").modal("hide");
            });
            return;
        }
        $this.parent().after("<span class='text-danger'>被禁的成员将不能再上传照片</span>");
        $this.removeClass("btn-default").addClass("btn-warning").text("再次点击确认");
        $this.data("executable", true);
        var timeId = setTimeout(function () {
            $this.removeData("executable");
            $this.parent().next(".text-danger").remove();
            $this.removeClass("btn-warning").addClass("btn-default");
            $this.html("<span class='glyphicon glyphicon-remove'></span>&nbsp;封禁此人");
        }, 2000);
        $this.data("time", timeId);
    });
    $("#btn-member-enable").click(function () {
        var $this = $(this);
        if ($this.data("time")) {
            clearTimeout($this.data("time"));
            $this.removeData("time");
        }
        if ($this.data("executable")) {
            $.getJSON("/gallery/member/enable/${member.id}", function (json) {
                if (json.ok) {
                    location.reload();
                } else {
                    alert(json.msg);
                }
                $(".modal").modal("hide");
            });
            return;
        }
        $this.removeClass("btn-default").addClass("btn-warning").text("再次点击确认");
        $this.data("executable", true);
        var timeId = setTimeout(function () {
            $this.removeData("executable");
            $this.parent().next(".text-danger").remove();
            $this.removeClass("btn-warning").addClass("btn-default");
            $this.html("<span class='glyphicon glyphicon-ok'></span>&nbsp;解封此人");
        }, 2000);
        $this.data("time", timeId);
    });
</script>